<template>
	<view class="withdrawal" style="margin: 0 25rpx;" v-if="userInfo">
		<view class="top-box">
			<image src="../../static/wallet/money.png" mode="scaleToFill" style="width: 66rpx;height: 66rpx;"></image>
			<view style="color: rgba(255, 255, 255, 0.64);margin-top: 20rpx;">{{$t('可提现钻石')}}</view>
			<view style="font-size: 54rpx;font-weight: bold;margin-top: 20rpx;">{{userInfo.money}}</view>
		</view>
		<view class="title-box" style="margin-top: 60rpx;">
			<view class="title-left"></view>
			<view class="font-34 bold">{{$t('提现钻石')}}</view>
		</view>
		<view class="ice-mt-30">
			<u--input
			    :placeholder="$t('请输入提现钻石')"
			    border="surround"  v-model="money"
			  ></u--input>
		</view>
		<view class="title-box" style="margin-top: 60rpx;">
			<view class="title-left"></view>
			<view class="font-34 bold">{{$t('钱包地址')}}</view>
		</view>
		<view class="ice-mt-30">
			<u--input
			     disabled
			    border="surround" :value="userInfo.username"
			  ></u--input>
		</view>
		<view style="position: fixed;width: 700rpx;bottom: 34rpx;;left: 25rpx;">
			<u-button size="large" shape="circle" @click="doSubmit" :text="$t('申请提现')" color="linear-gradient(106deg, #258CE9, #DA2B45)"></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				type:"",
				userInfo:null,
				money:'',
			}
		},
		onLoad(e) {
			this.type = e.type;
			uni.setNavigationBarTitle({
				title:this.$t("提现")
			})
			this.getUserInfo();
		},
		methods: {
			getUserInfo() {
				let tmp = uni.getStorageSync('userInfo')
				if (tmp) {
					this.userInfo = JSON.parse(tmp)
				}
				uni.$ice.post('user/index', {}, false).then(res => {
					uni.setStorageSync('userInfo', JSON.stringify(res.data));
					this.userInfo = res.data
					uni.stopPullDownRefresh()
			
				}).catch(err => {
			
				})
			},
			doSubmit(){
				uni.$ice.post('wallet/withdraw', {money:this.money}, true).then(res => {
					this.getUserInfo()
					uni.showToast({
						title:this.$t(res.msg),
						icon:'none'
					})
					uni.stopPullDownRefresh()
							
				}).catch(err => {
							
				})
			},
		}
	}
</script>

<style scoped>
	
	.withdrawal{
		padding-top: 20px
	}
	.top-box{
		background: linear-gradient(119deg, #258CE9, #DA2B45);
		border-radius: 12rpx;
		margin: auto;
		text-align: center;
		padding: 54rpx 0 60rpx 0;
	}
	.withdrawal .main{
		width: 91%;
		box-sizing: border-box;
		box-shadow: -1px 0 3px #6c4eed, 0 -1px 2px #69bbf5, 1px 0 3px #f56971;

		border-radius: 32rpx;
		margin: 0 auto;
		padding: 14px 18px 16px 19px
	}

	.withdrawal .main .title{
		color: #fff;
		font-size: 40rpx;
		margin-bottom: 38rpx;
		font-weight: 700
	}

	.withdrawal .main .input{
		width: 100%;
		box-sizing: border-box;
		height: 110rpx;
		border-radius: 24rpx;
		border: 1px solid #c625ff;
		display: flex;
		justify-content: space-between;
		padding-left: 48rpx;
		padding-right: 40rpx;
		color: #fff;
		font-size: 44rpx;
		font-weight: 700;
		align-items: center;
	}

	.withdrawal .main .input .unit{
		font-size: 32rpx;
		font-weight: 400;
		line-height: 106rpx
	}

	.withdrawal .main .center{
		color: #fff;
		padding-bottom: 30rpx;
		font-size: 24rpx
	}

	.withdrawal .main .center .num{
		line-height: 72rpx
	}

	.withdrawal .main .btn{
		width: 100%;
		box-sizing: border-box;
		height: 74rpx;
		margin-bottom: 40rpx;
		background-image: url("../../static/btn-bg.png");
		background-repeat: no-repeat;
		background-size: 100% 100%;
		color: #fff;
		text-align: center;
		line-height: 74rpx;
		font-size: 36rpx
	}

	.withdrawal .main .tip{
		font-size: 24rpx;
		color: #7776a8
	}

	.withdrawal .main .tip .tip-list{
		margin-bottom: 10rpx
	}
</style>